<template>
  <el-select
    filterable
    v-model="currval"
    placeholder="请选择"
    :style="component.property"
    :disabled="
      (component ? component.disabled : formData[formKey].disabled) ||
      formData[formKey].disabled == true
        ? true
        : false
    "
    @change="$listeners.change($event)"
    @visible-change="$listeners['visible-change']($event)"
    @remove-tag="$listeners['remove-tag']($event)"
    @clear="$listeners.clear($event)"
    @focus="$listeners.focus($event)"
    @blur="$listeners.blur($event)"
  >
    <el-option
      v-for="item in formData[componentKey].options"
      :key="item.attrValue"
      :label="item.attrValueName"
      :value="item.attrValue"
    ></el-option>
  </el-select>
</template>

<script>
import http from "../../utils/http";
export default {
  name: "DynSelect",
  props: {
    attrId: [String, Number],
    productId: [String, Number],
    value: [String, Number],
    component: {
      type: Object,
      default: () => {
        return {};
      },
    },
    formData: {
      type: Object,
    },
    formKey: {
      type: String,
    },
  },
  created() {
    if (this.component) {
      this.componentKey =
        this.component.pageTempStructId + "-" + this.component.attrId;
    } else {
      this.componentKey = this.formKey;
    }
    this.getAttrValueList();
  },
  data() {
    return {
      options: [],
      componentKey: "",
    };
  },
  computed: {
    currval: {
      get: function () {
        return this.value;
      },
      set: function (newValue) {
        this.formData[this.componentKey].value = newValue;
        this.$emit("input", newValue);
      },
    },
  },
  methods: {
    async getAttrValueList() {
      let res = await http({
        url: `${process.env.VUE_APP_CTX_ORDER_QUERY}/qryAttrValueList`,
        params: {
          attrId: this.attrId,
          productId: this.productId,
          actionValue: this.component.actionValue,
        },
        method: "GET",
      });
      if (res.code == 200) {
        this.formData[this.componentKey].options = res.meta.attrValueList;
      } else {
      }
    },
    selblur() {
      this.$emit("input", this.currval);
    },
  },
};
</script>

<style></style>
